<template>
  <div class="vip_pay">
    <div class="lc">
      <p class="pay">
        购买已更全集<span>￥{{ price }}</span>
      </p>
    </div>
    <div class="rc">
      <a href=""> 6元开会员 免费听 </a>
    </div>
  </div>
</template>

<script>
export default {
    props:{
        price:{
            type:Number
        }
    }
};
</script>

<style lang="scss" scoped>
.vip_pay {
  position: fixed;
  width: 100%;
  height: 60px;
  left: 0;
  bottom: 0;
  display: flex;
  z-index: 100000;
  div {
    flex: 1;
  }
  .lc {
    display: flex;
    align-items: center;
    justify-content: center;

    background: #fff;

    box-shadow: 0 -2px 4px 0 #f3f4f5;
    .pay {
      font-size: 14px;

      font-weight: 500;
      color: #333;
      line-height: 25px;
      span {
        display: inline-block;
        margin: 0 5px 0 4px;
        color: #f86442;
        font-size: 18px;
      }
    }
  }
  .rc {
    background-image: linear-gradient(
      125deg,
      #ffdebe 0,
      #f3cba6 46%,
      #dca574 100%
    );text-align: center;
    a {
      font-size: 15px;
      line-height: 60px;
      

      color: #9b7b55;
    }
  }
}
</style>

